<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="运动框架.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<style type="text/css">
		body{
			margin: 0px;
			padding: 0px;
		}
		div{
			width: 500px;
			height: 300px;
			background-color:red ;
			position: relative;
		}
		.div1{
		
			width: 500px;
			height: 300px;
			z-index: 1;
			
		}
		#p{
			display: block;
			margin: 0px;
			padding: 0px;
			position: absolute;
			top: 0px;
			right: 0%;
			background-color:white;
			width: 100px;
			height: 100px;
			z-index: 100;
			/*display: none;*/
			opacity: 0;
		}
	</style>
	<script type="text/javascript">
		var odiv;
		var p;
		var	num;
		window.onload=function(){
			odiv =document.getElementById('odiv');
			btn=document.getElementById('p');
			div1=document.getElementById('div1');
			num= true;
			
				
			
			odiv.onclick=function(){
				
					
					move(odiv,{width:1200},function(){
						move(odiv,{height:500},
							function(){
								move(div1,{width:1200},function(){
									move(btn,{opacity:100});
								});
							}
					
							
						);
					});
				
			}
			btn.onclick=function(){
				console.log('55');
				
				
				move(odiv,{width:500},function(){
						move(odiv,{height:300},);
					});
				
				
			}
			
		}
	</script>
	<body>
		<div class="div1" id="div1">
		<div class="" id="odiv">
			
		</div>
		<button id="p">×</button>
		</div>
	</body>
</html>
